<%-- 
    Document   : formGrupo
    Created on : 03-jul-2012, 15:03:24
    Author     : Administrador
--%>
<%@page import="com.javabeans.ItinerarioHorario"%>
<%@page import="com.javabeans.Aula"%>
<%@page import="com.javabeans.Horario"%>
<%@page import="com.javabeans.DiaSemana"%>
<%@page import="com.javabeans.Materia"%>
<%@page import="com.javabeans.Carrera"%>
<%@page import="com.javabeans.Usuario"%>
<%@page import="com.javabeans.ItinerarioGrupo"%>
<%@include file="../../../controlSession.jsp" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<%
    int accion = 121;
    int i = 0;
    String title = "Nuevo Grupo de Itinerario";
    boolean isNew = true;
    int idItinerarioGrupo = 0;
    ItinerarioGrupo ig = new ItinerarioGrupo();
    Carrera carrera = (Carrera)request.getAttribute("Carrera");
    if(request.getAttribute("ItinerarioGrupo") != null){
        accion = 122; // editar un itinerario grupo
        isNew = false;
        ig = (ItinerarioGrupo)request.getAttribute("ItinerarioGrupo");        
        title = "Modificar Grupo de Itinerario";
        idItinerarioGrupo = ig.getIdItinerarioGrupo();
    }
    
    List<DiaSemana> diasSemana = (List<DiaSemana>)request.getAttribute("diasSemana");
    List<Horario> horarios = (List<Horario>)request.getAttribute("horarios");
    List<Aula> aulas = (List<Aula>)request.getAttribute("aulas");
    // docentes por unidad académica, carreras por unidad académica
    List<Materia> materiasFac = (List<Materia>)request.getAttribute("materiasFac");
    List<Usuario> docentesFac = (List<Usuario>)request.getAttribute("docentesFac");
    List<Carrera> carreras = (List<Carrera>)request.getAttribute("carreras");
%>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>SI-ESFM </title>
        <meta name="description" content="Derechos Reservados SI-ESFM." />
        <link rel="stylesheet" href="<%=s_path%>/css/styles.css" type="text/css" />
        <link rel="stylesheet" href="<%=s_path%>/css/menu/style.css" type="text/css" />
        <link rel="shortcut icon" href="<%=s_path%>/images/ico.png" type="image/png" />
        <script type="text/javascript" src="<%=s_path%>/js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/validate/jquery.validate.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/comun.js"></script>
    <script type="text/javascript">
        <%
            i=0;
            out.println(" materiasFacultad = new Array();");
            for(Materia m:materiasFac){
                out.print(" materiasFacultad["+i+"] = new Array("+m.getIdCarrera()+","+m.getIdMateria()+",'"+m.getNombre()+"');");
                i++;
            }
            out.println("");
            i=0;
            out.println(" horarios = new Array(); ");
            for(Horario h:horarios){
                out.print(" horarios["+i+"] = new Array("+h.getIdDiaSemana()+","+h.getIdPeriodoDia()+",'"+h.getDiaSemana().getNombre()+"','"+h.getPeriodoDia().getHoraIni()+"','"+h.getPeriodoDia().getHoraFin()+"');");
                i++;
            }
            out.println("");
            i=0;
            out.println(" aulas = new Array(); ");
            for(Aula a:aulas){
                out.print(" aulas["+i+"] = new Array("+a.getIdAula()+",'"+a.getNro()+"','"+a.getDescripcion()+"');");
                i++;
            }
        %>    
        $(document).ready(function(){
            
            $("#formGrupo").validate({
                submitHandler: function(form){
                    $.ajax({
                        type: 'POST',
                        url: 'Administracion',
                        data: $('#formGrupo').serialize(),
                        success: function(res){
                            $('#content').html(res);
                        },
                        error:function(){alert("Error! al registra el itinerario de grupo.")}
                    });
                }
            });
            
            $.fn.verCheck = function(obj,nomCarrera){
                if(obj.checked){ // el check esta chekado
                    idCarrera = obj.value;
                    $("#divDocente").generaSelectMat(idCarrera,nomCarrera);
                }else{
                    eliminarElemento("div"+obj.id);
                }
            }
            $.fn.checkDia = function(obj,dia){
                idDiaSemana = obj.value;
                if(obj.checked){ // el check esta chekado
                    $("#divBoton").generaPeriodosDia(idDiaSemana,dia);
                }else{
                    eliminarElemento("divH"+idDiaSemana);
                }
            }
            
            jQuery.fn.generaSelectMat = function(idCarrera,nomCarrera){
		$(this).each(function(){
                    elem = $(this);
                    texto_insertar = '<div id="div'+idCarrera+'" style="clear:both;">';
                    texto_insertar += ' <label class="form_align43">Seleccione Materia de '+nomCarrera+' : </label>';
                    texto_insertar += ' <select name="idMateria_'+idCarrera+'" id="idMateria_'+idCarrera+'" class="required form_input_align" title="Seleccione una materia!">';
                    texto_insertar += '     <option value="">Seleccione</option>';
                    for(i=0;i<materiasFacultad.length;i++){
                        if(idCarrera == materiasFacultad[i][0]){
                            texto_insertar += '<option value="'+materiasFacultad[i][1]+'">'+materiasFacultad[i][2]+'</option>';
                        }
                    }
                    texto_insertar += ' </select>';
                    texto_insertar += ' <label class="error">*</label>';
                    texto_insertar += '</div><br/>';
                    nuevo_campo = $(texto_insertar);
                    elem.before(nuevo_campo);
		});
		return this;
            }
            
            jQuery.fn.generaPeriodosDia = function(idDiaSemana,dia){
		$(this).each(function(){
                    elem = $(this);
                    texto_insertar = '<div id="divH'+idDiaSemana+'">';
                    texto_insertar += ' <div style="clear:both;">';
                    texto_insertar += '     <label class="form_align43">Seleccione periodo para el d&iacute;a <b>"'+dia+'"</b> : </label>';
                    texto_insertar += '     <select name="idPeriodoDia_'+idDiaSemana+'" id="idPeriodoDia_'+idDiaSemana+'" class="required form_input_align" title="Seleccione un periodo!">';
                    texto_insertar += '         <option value="">Seleccione</option>';
                    for(i=0;i<horarios.length;i++){
                        if(idDiaSemana == horarios[i][0]){
                            texto_insertar += ' <option value="'+horarios[i][1]+'">'+horarios[i][3]+' - '+horarios[i][4]+'</option>';
                        }
                    }
                    texto_insertar += '     </select>';
                    texto_insertar += '     <label class="error">*</label>';
                    texto_insertar += ' </div>';
                    texto_insertar += ' <div style="clear:both;">';
                    texto_insertar += '     <label class="form_align43">Seleccione aula para el d&iacute;a <b>"'+dia+'"</b> : </label>';
                    texto_insertar += '     <select name="idAula_'+idDiaSemana+'" id="idAula_'+idDiaSemana+'" class="required form_input_align" title="Seleccione un aula!">';
                    texto_insertar += '         <option value="">Seleccione</option>';
                    for(i=0;i<aulas.length;i++){
                        texto_insertar += '<option value="'+aulas[i][0]+'">'+aulas[i][1]+' - '+aulas[i][2]+'</option>';
                    }
                    texto_insertar += '     </select>';
                    texto_insertar += '     <label class="error">*</label>';
                    texto_insertar += ' </div>';
                    texto_insertar += ' </div><br/>';
                    nuevo_campo = $(texto_insertar);
                    elem.before(nuevo_campo);
		});
		return this;
            }
            
            $("input[name=limitado]").change(function(){
                valor = $("input[name='limitado']:checked").val();
                if(valor == "true"){
                    $("#divCupo").css("display", "block");
                }else{
                    $("#divCupo").css("display", "none");
                }
            }); 
        
        });
        
        function eliminarElemento(id){
            obj = document.getElementById(id);
            if(obj){
                padre = obj.parentNode;
                padre.removeChild(obj);
            }
        }
        
        function changeMateria(obj){
            aux = obj.id;
            i = aux.indexOf("_");
            idCarrera = aux.substring(i+1);
            aux = obj.value;
            if(aux != ""){
                $.ajax({
                    url: "Administracion",
                    type: "GET",
                    data:{ accion:120 , idCarrera:idCarrera,idMateria:aux},
                    success:function(res){
                        $('#nroGrupo').val(res);
                    },
                    error: function(res){ alert("Error! al mostrar el numero de grupo!"); }
                });
            }else{
                $("#nroGrupo").html("");
            }
        }
        function back(idCarrera,nomCarrera){
            var sbody = "accion=116&idCarrera="+idCarrera+"&nomCarrera="+nomCarrera;
            location.href = "Administracion?"+sbody;
        }
    </script>
    </head>
    <body onload="showTime(<%=s_param%>)">
        <div id="top-wrap">
            <!-- cabeza principal -->
            <%@include file="../../../head.jsp" %>
            <!-- cuerpo -->
            <div id="bodySpace">               
                <!-- aqui va la ruta -->
                <div class="clearfix" id="middle">
                    <!-- aqui va el arbol de entrada -->
                    <div id="breadcrumb"><!-- le da la forma de la imagen -->
                        <ul>
                        <li><a href="<%=s_path%>/principal.jsp">Home</a></li>
                        <li><span style="color:#666">Administraci&oacute;n</span></li>
                        <li class="current-page"><span class="end"><span class="middle">Itinerario de Grupos</span></span></li>
                        </ul>
                        <!-- para la hora -->
                        <div style="clear: both;position: absolute;text-align: right;width: 100%;"><span id="fechaServ"></span>&nbsp;&nbsp;<span id="horaServ" style=""></span>&nbsp;</div>
                    </div><!-- begin SIDEBAR FIRST -->
                </div>
                <div id="principal">
                    <!-- todo; el cuerpo disponible para el area de trabajo -->
                    <div class="cuerpoCompleto" style="border: 0px solid">
                        <div class="innerLeft" style="border: 0px solid">
                            <!-- supuestamente aca biene el contenido -->
                            <div id="content">
                            <h2 class="decorado" id="titleForm"><%=title%></h2><br/>
                            <form id="formGrupo">
                                <input type="hidden" name="accion" id="accion" value="<%=accion%>"/>
                                <input type="hidden" name="idFacultad" id="idFacultad" value="<%=carrera.getIdFacultad()%>"/>
                                <input type="hidden" name="idCarrera" id="idCarrera" value="<%=carrera.getIdCarrera()%>"/>
                                <input type="hidden" name="nomCarrera" id="nomCarrera" value="<%=carrera.getNombre()%>"/>
                                <input type="hidden" name="idItinerarioGrupo" id="idItinerarioGrupo" value="<%=idItinerarioGrupo%>" />
                                <div style="clear:both;">
                                    <label class="form_align43">Seleccione Especialidad(es) : </label>
                                        <div style="float: left">
                                <%
                                    String aux = "";
                                    for(Carrera c:carreras){
                                        aux = "";
                                        if(!isNew){
                                            for(Materia m:ig.getMaterias()){
                                                if(c.getIdCarrera() == m.getIdCarrera()){
                                                    aux = "checked='true'";
                                                }
                                            }
                                            out.println("<div>&nbsp;&nbsp;<input type='checkbox' name='carreras' id='"+c.getIdCarrera()+"' "+aux+" value='"+c.getIdCarrera()+"' class='required' onClick='$.fn.verCheck(this,\""+c.getNombre()+"\")' /><label for="+c.getIdCarrera()+">&nbsp;&nbsp;"+c.getNombre()+"</label></div>");
                                        }else{
                                            out.println("<div>&nbsp;&nbsp;<input type='checkbox' name='carreras' id='"+c.getIdCarrera()+"' "+((carrera.getIdCarrera()==c.getIdCarrera())?"checked='true'":"")+" value='"+c.getIdCarrera()+"' class='required' onClick='$.fn.verCheck(this,\""+c.getNombre()+"\")' /><label for="+c.getIdCarrera()+">&nbsp;&nbsp;"+c.getNombre()+"</label></div>");
                                        }
                                    }
                                %>  <br/>
                                        </div>
                                </div><br/>
                        <% if(isNew){   %>
                                <div style="clear:both;" id="div<%=carrera.getIdCarrera()%>">
                                    <label class="form_align43">Seleccione Materia de <%=carrera.getNombre()%> : </label>
                                    <select name="idMateria_<%=carrera.getIdCarrera()%>" id="idMateria_<%=carrera.getIdCarrera()%>" class="required form_input_align" title="Seleccione una materia!" onchange="changeMateria(this)">
                                        <option value="">Seleccione</option>
                                    <%
                                        for(Materia m:materiasFac){
                                            if(carrera.getIdCarrera() == m.getIdCarrera())
                                                out.println("<option value='"+m.getIdMateria()+"'>"+m.getNombre()+"</option>");
                                        }
                                    %>
                                    </select>
                                    <label class="error">*</label>
                                </div>
                        <%  
                            }else{
                                for(Materia m:ig.getMaterias()){
                                    out.println("<div style='clear:both;' id='div"+m.getIdCarrera()+"'>");
                                    out.println("   <label class='form_align43'>Seleccione Materia de "+m.getCarrera().getNombre()+" : </label>");
                                    out.println("   <select name='idMateria_"+m.getIdCarrera()+"' id='idMateria_"+m.getIdCarrera()+"' class='required form_input_align' title='Seleccione una materia!' onchange='changeMateria(this)'>");
                                    out.println("       <option value=''>Seleccione</option>");
                                    for(Materia ma:materiasFac){
                                        if(m.getIdCarrera() == ma.getIdCarrera())
                                            out.println("<option value='"+ma.getIdMateria()+"' "+((m.getIdMateria()==ma.getIdMateria())?"selected='true'":"")+">"+ma.getNombre()+"</option>");
                                    }
                                    out.println("   </select>");
                                    out.println("   <label class='error'>*</label>");
                                    out.println("</div>");
                                }
                            }
                        %>            
                                <div id="divDocente" style="clear:both;">
                                    <label class="form_align43" >Docente : </label>
                                    <select name="idDocente" id="idDocente" class="required form_input_align" title="Seleccione un docente!">
                                        <option value="">Seleccione</option>
                                    <%
                                        for(Usuario d:docentesFac){
                                            out.println("<option value='"+d.getIdUsuario()+"' "+((!isNew && d.getIdUsuario()==ig.getIdDocente())?"selected='true'":"")+">"+d.getDetalleDocente().getCategoria().getSigla()+" "+d.getNombre()+" "+d.getApellido()+"</option>");
                                        }
                                    %>
                                    </select>
                                    <label class="error">*</label>
                                </div>
                                <div style="clear:both;">
                                    <label class="form_align43" >Nro. Grupo : </label>
                                    <input type="text" name="nroGrupo" id="nroGrupo" value="<%=((!isNew)?ig.getNroGrupo():"")%>" class="required form_input_align" maxlength="6" size="5"/>
                                    <label class="error">*</label>
                                </div>
                                
                                <div style="clear:both;">
                                    <label class="form_align43" >Tipo de Cupo : </label>&nbsp;
                                    <input type="radio" name="limitado" id="limitadoTrue" value="true" <%=((!isNew && !ig.isLimitado())?"":"checked='true'")%> class=""/><label for="limitadoTrue">&nbsp;LIMITADO&nbsp;</label>
                                    <input type="radio" name="limitado" id="limitadoFalse" value="false" <%=((!isNew && !ig.isLimitado())?"checked='true'":"")%>/><label for="limitadoFalse">&nbsp;&nbsp;ILIMITADO</label>
                                </div>
                                <div style="clear:both; display: <%=((!isNew && !ig.isLimitado())?"none":"block")%>" id="divCupo">
                                    <label class="form_align43" >Cupo : </label>
                                    <input type="text" name="cupo" id="cupo" value="<%=((!isNew && ig.isLimitado())?ig.getCupo():"")%>" class="required number form_input_align" maxlength="3" size="5" />
                                    <label class="error">*</label>
                                </div><br/>
                                <div style="clear:both;" id="divCupo">
                                    <label class="form_align43" >&nbsp;</label>
                                    <h3 style="color:#004080;margin:3px 0px 3px 0px;">Horarios</h3>
                                </div>
                                <div style="clear:both;">
                                    <label class="form_align43">Seleccione d&iacute;a(s) : </label>
                                        <div style="float: left">
                                <%
                                    for(DiaSemana ds:diasSemana){
                                        aux = "";
                                        if(!isNew){
                                            for(ItinerarioHorario ih:ig.getItiHorarios()){
                                                if(ds.getIdDiaSemana() == ih.getIdDiaSemana()){
                                                    aux = "checked='true'";
                                                    break;
                                                }
                                            }
                                        }
                                        out.println("<div>&nbsp;&nbsp;<input type='checkbox' name='dias' id='dia"+ds.getIdDiaSemana()+"' "+aux+" value='"+ds.getIdDiaSemana()+"' class='required' onClick='$.fn.checkDia(this,\""+ds.getNombre()+"\")' /><label for='dia"+ds.getIdDiaSemana()+"'>&nbsp;&nbsp;"+ds.getNombre()+"</label></div>");
                                    }
                                %>      <br/>
                                        </div>
                                </div><br/>
                        <%
                            if(!isNew){
                                for(ItinerarioHorario ih:ig.getItiHorarios()){
                                    out.println("<div id='divH"+ih.getIdDiaSemana()+"'>");
                                    out.println("<div style='clear:both;'>");
                                    out.println("   <label class='form_align43'>Seleccione periodo para el d&iacute;a <b>"+ih.getDiaSemana().getNombre()+"</b> : </label>");
                                    out.println("   <select name='idPeriodoDia_"+ih.getIdDiaSemana()+"' id='idPeriodoDia_"+ih.getIdDiaSemana()+"' class='required form_input_align' title='Seleccione un periodo!'>");
                                    out.println("       <option value=''>Seleccione</option>");
                                    for(Horario h:horarios){
                                        if(ih.getIdDiaSemana() == h.getIdDiaSemana()){
                                            out.println("<option value='"+h.getIdPeriodoDia()+"' "+((ih.getIdPeriodoDia() == h.getIdPeriodoDia())?"selected='true'":"")+">"+h.getPeriodoDia().getHoraIni()+" - "+h.getPeriodoDia().getHoraFin()+"</option>");
                                        }
                                    }
                                    out.println("   </select>");
                                    out.println("   <label class='error'>*</label>");
                                    out.println("</div>");
                                    out.println("<div style='clear:both;'>");
                                    out.println("   <label class='form_align43'>Seleccione aula para el d&iacute;a <b>"+ih.getDiaSemana().getNombre()+"</b> : </label>");
                                    out.println("   <select name='idAula_"+ih.getIdDiaSemana()+"' id='idAula_"+ih.getIdDiaSemana()+"' class='required form_input_align' title='Seleccione un aula!'>");
                                    out.println("       <option value=''>Seleccione</option>");
                                    for(Aula a:aulas){
                                        out.println("   <option value='"+a.getIdAula()+"' "+((ih.getIdAula() == a.getIdAula())?"selected='true'":"")+">"+a.getNro()+" - "+a.getDescripcion()+"</option>");
                                    }
                                    out.println("   </select>");
                                    out.println("   <label class='error'>*</label>");
                                    out.println("</div>");
                                    out.println("</div><br/>");
                                }
                            }
                        %>
                                <div class="form_center" style="clear:both;" id="divBoton">
                                    <input type="submit" value="<%=(isNew)?"Registrar":"Modificar"%>" class="boton" title="Pulsa aqui para <%=(isNew)?"Registrar":"Modificar"%>" />&nbsp;&nbsp;
                                    <input type="button" value="Cancelar" onclick="back(<%=carrera.getIdCarrera()%>,'<%=carrera.getNombre()%>')" class="boton" title="Pulsa aqui para cancelar"/>
                                </div>
                            </form><br/>
                        </div><!-- id='content' -->
                    </div><!--end of leftPan-->
                </div><!--end of content-wrapper-->
            </div><!--end of body-wrap-->
            <!-- footer -->
        </div>
    </body>
</html>
